import pluginVue from 'eslint-plugin-vue' // 引入 ESLint 的 Vue 插件，提供 Vue 文件的 linting 规则
import vueTsEslintConfig from '@vue/eslint-config-typescript' // 引入 Vue 与 TypeScript 的 ESLint 配置，支持 Vue 项目中的 TypeScript
import pluginVitest from '@vitest/eslint-plugin' // 引入 Vitest 插件，用于 Vitest 测试的 linting
import pluginPlaywright from 'eslint-plugin-playwright' // 引入 Playwright 插件，用于 E2E 测试的 linting
import skipFormatting from '@vue/eslint-config-prettier/skip-formatting' // 引入 Prettier 跳过格式化的配置
import parser from 'vue-eslint-parser' // 引入 Vue 的 ESLint 解析器，用于解析 Vue 文件中的代码

export default [
  // 配置需要进行 Lint 检查的文件
  {
    name: 'app/files-to-lint',
    files: ['**/*.{ts,mts,tsx,vue}'], // 需要 lint 的文件类型，包括 TypeScript、TSX 和 Vue 文件
  },

  // 配置需要忽略的文件或目录
  {
    name: 'app/files-to-ignore',
    ignores: [
      '**/dist/**', // 忽略构建输出目录
      '**/dist-ssr/**', // 忽略服务器端渲染的构建输出目录
      '**/coverage/**', // 忽略测试覆盖率目录
      '.DS_Store', // 忽略 Mac 系统的 .DS_Store 文件
      'node_modules', // 忽略 node_modules 目录
      'dist', // 忽略 dist 目录
      'dist-ssr', // 忽略 dist-ssr 目录
      '*.local', // 忽略本地配置文件
      '.vscode', // 忽略 VSCode 配置目录
      '.idea', // 忽略 WebStorm 等 IDE 的配置目录
      '*.md', // 忽略 Markdown 文件
      '*.sh', // 忽略 Shell 脚本文件
    ],
  },

  // 使用 Vue 插件的基础配置，提供 Vue 项目的必要 lint 规则
  ...pluginVue.configs['flat/essential'],

  // 使用 Vue 的 TypeScript 配置，集成 Vue 和 TypeScript 的 lint 规则
  ...vueTsEslintConfig(),

  // Vitest 推荐的 ESLint 配置，用于测试文件的 linting
  {
    ...pluginVitest.configs.recommended,
    files: ['src/**/__tests__/*'], // 只对测试文件应用此规则
  },

  // Playwright 推荐的 ESLint 配置，用于 E2E 测试文件的 linting
  {
    ...pluginPlaywright.configs['flat/recommended'],
    files: ['e2e/**/*.{test,spec}.{js,ts,jsx,tsx}'], // 只对 E2E 测试文件应用此规则
  },

  // 通用的 ESLint 配置，适用于所有的 JS、TS 和 Vue 文件
  {
    files: ['**/*.{js,ts,vue}'], // 适用于 JS、TS、Vue 文件
    languageOptions: {
      parser: parser, // 使用 vue-eslint-parser 来解析 Vue 文件中的代码
      ecmaVersion: 2021, // 使用 ECMAScript 2021 版本的语法
      sourceType: 'module', // 使用 ES 模块的语法
      parserOptions: {
        parser: '@typescript-eslint/parser', // 对 TypeScript 代码使用 @typescript-eslint/parser 解析器
        ecmaFeatures: {
          jsx: true, // 支持 JSX 语法
        },
      },
      globals: {
        browser: true, // 全局启用浏览器相关的变量
        node: true, // 全局启用 Node.js 相关的变量
        es6: true, // 全局启用 ES6 相关的变量
      },
    },
    rules: {
      // TypeScript 相关的 lint 规则
      '@typescript-eslint/no-unused-expressions': 'off', // 关闭未使用的表达式检查
      '@typescript-eslint/no-explicit-any': 'off', // 允许使用 `any` 类型
      'no-debugger': 'off', // 允许使用 `debugger` 语句进行调试
      '@typescript-eslint/explicit-module-boundary-types': 'off', // 关闭强制显式声明模块边界类型的规则
      '@typescript-eslint/ban-types': 'off', // 允许使用一些不推荐的 TypeScript 类型
      '@typescript-eslint/ban-ts-comment': 'off', // 允许使用 TypeScript 注释
      '@typescript-eslint/no-empty-function': 'off', // 允许定义空函数
      '@typescript-eslint/no-non-null-assertion': 'off', // 允许使用非空断言（`!`）
      '@typescript-eslint/no-unused-vars': [
        'error',
        {
          argsIgnorePattern: '^_', // 忽略以 `_` 开头的函数参数未使用警告
          varsIgnorePattern: '^_', // 忽略以 `_` 开头的变量未使用警告
        },
      ],
      'no-unused-vars': [
        'error',
        {
          argsIgnorePattern: '^_', // 忽略以 `_` 开头的未使用变量
          varsIgnorePattern: '^_',
        },
      ],
      // Vue 相关的 lint 规则
      'vue/no-v-html': 'off', // 允许使用 `v-html` 指令
      'vue/require-default-prop': 'off', // 不强制为每个 prop 提供默认值
      'vue/require-explicit-emits': 'off', // 不强制显式声明组件的 `emits` 事件
      'vue/multi-word-component-names': 'off', // 允许组件名为单个单词
      'vue/html-self-closing': [
        'error',
        {
          html: {
            void: 'always', // 强制 HTML 空元素使用自闭合写法
            normal: 'always', // 强制常规 HTML 标签自闭合
            component: 'always', // 强制组件自闭合
          },
          svg: 'always', // 强制 SVG 标签自闭合
          math: 'always', // 强制 MathML 标签自闭合
        },
      ],
      // Prettier 相关的 lint 规则
      'prettier/prettier': [
        'error',
        {
          endOfLine: 'auto', // 自动识别并使用系统的换行符
        },
      ],
    },
  },

  // 跳过 Prettier 格式化规则，与 Prettier 结合使用时跳过格式化检查
  skipFormatting,
]
